<template>
	<view class="main-cont box box-tb box-pack-start box-align-center">
		<view class="top">
			<view class="search box box-align-center box-pack-start mt20">
				<u-input v-model="search" type="text" :border="border" :custom-style="customStyles" placeholder="搜索学生" @input="listClassStuInfo"/>
				<u-image src="@/static/class/icon_search.png" width="34rpx" height="34rpx" @click="listClassStuInfo">
					<u-loading slot="loading"></u-loading>
				</u-image>
			</view>
		</view>
		<view class="group">
			<view class="top box box-align-center box-pack-between">
				学生（{{stuList.length}}人）
				<u-button type="primary" open-type="share" :custom-style="customStyle">邀请</u-button>
			</view>
			<view class="bottom">
				<view class="stu-list box box-align-center box-pack-between" v-for="(item,i) in stuList" :key="i" @click="details(item.id)">
					<view class="box box-align-center box-pack-start">
						<u-avatar :src="item.icon" size="73"></u-avatar>
						<view class="ml5 mr5 stu-name">
							{{item.name}}
						</view>
					</view>
					<view class="xh">
						 {{item.bjmc==null?'未加入任何班级':item.bjmc}}
					</view>
				</view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				currSchool:uni.getStorageSync('currSchool'),
				pfxzList:[],
				stuList:[],
				stuNum:0,
				bjmc:"",
				customStyles: {
					width:"560rpx",
					padding: "40rpx",
					color: "#000"
				},
				search:"",
				customStyle: {
					width: '75px',
					height: '34px',
					lineHeight: '45rpx',
					backGround: '#7686F6',
					borderRadius: '26rpx',
					padding:'10rpx 20rpx',
					marginLeft:'30rpx'
				},
				user:uni.getStorageSync("user"),
				invite_cnt:'',//邀请学校人数
				openid:'',
				unionid:'',
				schoolid:'',
				userid:'',
			}
		},
		onShareAppMessage(res) {
			wx.vibrateShort();
			return {
					title: this.user.name+'老师请您加入【'+this.currSchool.name+'】,已有'+this.invite_cnt+'人加入~', 
					path: '/team/tr/invite?schoolid=' + this.currSchool.id + '&userid=' + this.userid+
					     '&schoolname='+this.currSchool.name+'&trname='+this.user.name+'&icon='+this.user.icon,
					imageUrl: 'https://yh-sys.oss-cn-beijing.aliyuncs.com/2AA82D3CF32F47D0BBFBC6037E73D503join.png?Expires=4792987242&OSSAccessKeyId=LTAI4GL8SwAiLh3sSPXDS7z9&Signature=skoxCO1pZ1kn3DJIiBTnGM%2FO2oY%3D'
			}
		},
		onLoad: function(options) {
			if(options.scene!=undefined){
				// console.log(1)
				this.getunionid(options);//获取openid、unionid 并检查用户
			}else{
				// console.log(2)
				this.listClassStuInfo();
				this.getschooltrs();
			}
		},
		methods: {
			getunionid(options){
				wx.login({
					success: res => {
						var _this=this;
						_this.$api.post({url: '/comm/getAppletUnionid'}, {code: res.code}).then(s => {
							console.log(s);
							_this.openid = s.openid;
							_this.unionid = s.unionid;
							this.currSchool=s.school;
							if(s.code == '0'){
								uni.setStorageSync('role', s.role);
								uni.setStorageSync('user', s.user);
								this.user=s.user;
								if(options.scene!=undefined){
										/** 解析数据 */
										var arr = decodeURIComponent(options.scene).split(',');
										this.schoolid=arr[0];
										this.userid=arr[1];
										this.classid = options.classid;
										this.stuNum = options.stuNum;
										this.bjmc = options.bjmc;
								}else{
									this.schoolid=s.user.schoolId;
									this.userid=s.user.id;
								}
								this.listClassStuInfo();
								this.getschooltrs();
							}else{
								this.$refs.uToast.show({
								   title: '您未注册用户！',
								   	type: 'default'
								})	
									uni.reLaunch({url: '/pages/index/index'})//无此用户 自动跳转到登录页
							}
							
						})
					  }
				});
			},
			details(id){
				uni.navigateTo({url:`./studetails?userid=${id}&schoolid=${this.schoolid}`})
			},
			listClassStuInfo(){
				let opts = {
					url: '/dstudent/listSchoolStu',
					method: 'post'
				};
				this.$api.post(opts, {schoolid: this.currSchool.id,textSearch:this.search}).then(res => {
					this.stuList = res.list;
				})
			},
			goEdit(){
				uni.navigateTo({
					url:"/pageHome/scoreGroup"
				})
			},
			getschooltrs(){
				this.$api.post({url: '/dteacher/getschooltrs'}, {schoolid:this.currSchool.id}).then(res => {
					this.invite_cnt=res.cnt;
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.top {
		width: 100%;
		background-color: #fff;
		padding-bottom: 25rpx;
	}
	
	.search {
		margin: 20rpx auto 0;
		width: 710rpx;
		height: 86rpx;
		background: #F3F4FB;
		border-radius: 43rpx;
	}
	
	.main-cont{
		width: 100%;
		
		.list{
			padding: 0 39rpx;
			width: 100%;
			height: 140rpx;
			background: #FFFFFF;
			
			.icon {
				width: 8rpx;
				height: 84rpx;
				background: #FE907E;
				border-radius: 4rpx;
			}
			
			.class-name {
				font-size: 32rpx;
			}
			
			.tab {
				font-size: 26rpx;
				color: #6E73D8;
			}
			
			.edit {
				width: 168rpx;
				height: 46rpx;
				line-height: 46rpx;
				background: #626BF1;
				border-radius: 23rpx;
				font-size: 24rpx;
				color: #fff;
				text-align: center;
			}
		}
		
		.group {
			margin: 20rpx 14rpx;
			width: 722rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			
			.top {
				padding: 0 39rpx;
				height: 98rpx;
				line-height: 98rpx;
				border: 2rpx solid #F0F1F8;
			}
			
			.bottom {
				// height: 470px;-+
				overflow-y: scroll;
				.stu-list {
					padding: 0 60rpx;
					height: 130rpx;
				}
				
				.stu-name {
					font-size: 28rpx;
					color: #181623;
					width: 150px;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
				
				.tab {
					width: 86rpx;
					height: 28rpx;
					line-height: 28rpx;
					background: #FFE2CC;
					border-radius: 5rpx;
					text-align: center;
					font-size:24rpx;
					color: #E96501;
				}
				
				.xh{
					width: 130px;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
			}
		}
	}
</style>
